<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      //1.父节点  parentNode
      var erweima = document.querySelector;

      // 获取元素的 父节点     元素.parentNode
      console.log();
      //2.1 获取的是所有的节点 包含文本等 使用 频率较少 元素.childNodes
      console.log(box.childNodes);
      //2.2 非标准流(重点掌握)                元素.children    获取的是个组合
      console.log(box.children);
      console.log(box.children[0]);

      //3 获取第一个 最后一个儿子
      var ul = document.querySelector('ul');
      console.log(ul.fisrtChild);
      console.log(ul.lastChild);
      //.3.2 获取第一个和最后一个元素节点
      console.log();
      //3.3 通过children 获取    激情推荐
      console.log(ul.children); //获取的是集合
      console.log(ul.children[0]); //下标
      console.log(ul.children[ul.children.length - 1]);
    </script>
  </body>
</html>
